import React, { useEffect, useState } from "react";
import { NavBar, List } from "antd-mobile";
import { theatredetail } from "../../service/movieService";
import { useNavigate, useLocation } from "react-router";
import "./hotMovie.scss";
interface DetailListData {
  name: string;
  address: string;
}
export default function TheatreDetail() {
  let location = useLocation();
  let history = useNavigate();
  let [detailList, setDetailList] = useState<DetailListData>({
    name: "",
    address: "",
  });
  let addressId = location.pathname.split("detail/")[1];
  const back = () => history(-1);

  // console.log(addressId);
  useEffect(() => {
    (async () => {
      let res = await theatredetail(addressId);
      if (res.data.code === 200) {
        setDetailList(res.data.data);
      }
      console.log(res);
    })();
  }, []);
  return (
    <div>
      <div>
        <NavBar onBack={back}>{detailList.name}</NavBar>
      </div>
      <div className="theatre-box">
        <div className="theatre-img">
          <img
            src="https://inews.gtimg.com/newsapp_bt/0/11723307064/1000"
            alt="电影图片"
          ></img>
        </div>
        <div className="theatre-name">{detailList.name}</div>
        <div className="theatre-address">
          <span>详细地址:</span>
          {detailList.address}
        </div>
      </div>
    </div>
  );
}
